<?php
/* @var $this DashboardController */

$this->breadcrumbs = array(
    'Dashboard',
);
?>
<div>
    <p>
    <h3>Your Schedule</h3>
    <div >
        <div id='calendar'></div>
        <?php
        $cs = Yii::app()->clientScript;
        $cs->registerScriptFile(Yii::app()->getBaseUrl() . '/js/calendar/_loader.js');
        $this->renderPartial('/common/calendar');
        ?>
        <script type="text/javascript">
            var result = JSON.parse('<?php echo $cal_config; ?>');
            context = new Array();
            context['resource_id'] = <?php echo Yii::app()->user->id; ?>;
            context['service_id'] = 0;
            result.eventClick = function(calEvent, jsEvent, view) {
                var s = 'Mark ' + calEvent.title + ' as Done';
                var iframe = document.createElement('iframe');
                // iframe.style.display = "none";
                iframe.style.width = "100%";
                iframe.style.height = "100%";
                iframe.src = "<?php echo $this->createUrl('Service/doneRequest') ?>" + "?eventId=" + calEvent.id;
                document.getElementById('doneService_content').innerHTML = "";
                document.getElementById('doneService_content').appendChild(iframe);
                document.getElementById('doneService').style.visibility = "visible";

            };
            showCalender(null, result, context);
        </script>
    </div>
    <style>
        #doneService {
            visibility: hidden;
            position: fixed;
            left:30%;
            top: 0px;
            width:700px;
            height: 300px;  
            text-align:right;
            z-index: 1000;
        }
        #doneService div {
            background-color: #fff;
            border: 1px solid #ccc;
            height: 226px;
            padding: 15px;
            text-align: center;
            width: 700px;
        }



    </style>
    <div id="doneService" style="visibility: hidden" >
        <script type="text/javascript">
            function close_btn() {
                document.getElementById('doneService_content').innerHTML = '';
                document.getElementById('doneService').style.visibility = 'hidden';
                $("#calendar").fullCalendar('refetchEvents');
            }
        </script>
        <input type="button" value="Close" text="Close"  onclick="close_btn();" style="border:none;position:relative; left:0px;top:40px;"></input>
        <div id="doneService_content">

        </div>
    </div>

</p>
</div>
